{% extends 'base.html' %}
{% load static %}

{% block title %}
{{ article.title }}
{% endblock %}

{% block content %}
    {% block mycss %}
        {{ block.super }}
        <link type="text/css" href="https://cdn.bootcss.com/highlight.js/9.15.8/styles/github.min.css" rel="stylesheet">

        <link href="{% static 'css-theme/' %}{{ THEME }}{{ '/article/info.css' }}"  rel="stylesheet">
        <link href="{% static 'css-theme/' %}{{ THEME }}{{ '/article/code.css' }}"  rel="stylesheet">


        <style>
            /* for block of numbers */
            .hljs-ln-numbers {
              -webkit-touch-callout: none;
              -webkit-user-select: none;
              -khtml-user-select: none;
              -moz-user-select: none;
              -ms-user-select: none;
              user-select: none;

              text-align: center;
              color: #ccc;
              border-right: 1px solid #CCC;
              vertical-align: top;
              padding-right: 5px;
            }

            .hljs-ln-n {
              width: 30px;
            }

            /* for block of code */
            .hljs-ln .hljs-ln-code {
              padding-left: 10px;
              white-space: pre;
            }
        </style>
    {% endblock %}

    <article>
        <div class="infos" id="article_content">
            <div class="newsview">

                <div>
                    <h2 class="news_title">{{ article.title }}</h2>
                </div>
                <div class="news_author">
                    <span class="au02">{{ article.date }}</span>
                </div>
                <br>
                <div class="tags">
                    {% for tag in article.tags %}
                        <a href="/" target="_blank">{{ tag }}</a>
                    {% endfor %}

                </div>
                <div class="news_about">
                    <strong>简介</strong>
                    {{ article.description }}
                </div>

                <div class="news_infos">
                    {{ article.content | safe }}
                </div>

                <script src="https://cdn.bootcss.com/highlight.js/9.15.8/highlight.min.js"></script>
                <script src="https://cdn.bootcss.com/highlightjs-line-numbers.js/2.7.0/highlightjs-line-numbers.min.js"></script>

                <script>
                    hljs.initHighlightingOnLoad();
                    hljs.initLineNumbersOnLoad();
                </script>
            </div>
        </div>
    </article>

    <script>
        $("document").ready(function(){
            var img=$("article img");
            for(var i = 0;i < img.length; i++){
                var id = img.get(i).id;
                if (id.length > 0){
                    set_image(id, id, false);
                }
            }
        })
    </script>
{% endblock %}




